<template>
    <div class="items-box">
        <div class="item">
            <mt-cell v-for="(item,index) in titleArr" :key="index" :title="item" >{{valueArr[index]}}</mt-cell>
            <mt-cell class="only"  v-if="flag"   title="查看订单详情">
                <i class="mint-cell-allow-right"> </i>
            </mt-cell>
        </div>
    </div>
</template>


<script>
export default {
    props:['item','flag'],
    data(){
        return {
            titleArr:Object.keys(this.item),
            valueArr:Object.values(this.item)
        }
    },
    mounted(){
        console.log(this.flag)
    }
}
</script>

<style scoped>
.items-box >>> .mint-cell-wrapper{
  display: flex;
}
.items-box  >>> .mint-cell-title{
  text-align: left;
}
.only >>> .mint-cell-title{
    color: rgb(107, 184, 247);
  text-align: center;
}
.items-box >>> .mint-cell-value{
  padding-top: 10px;
  max-width: 70%;
}
.item{
    margin: 20px 0;
}
</style>